<template>
	<div class="formContent">
			<a-form
			    :form="form"
			    v-bind="formItemLayout"
			    @submit="handleSubmit"
			  >
<!--			  <a-form-item label="项目名称">-->
<!--				      <a-input-->
<!--					 v-decorator="this.validator.projectName"-->
<!--				      />-->
<!--			  </a-form-item>-->
			   <a-form-item label="需求名称">
				      <a-input
 					 v-decorator="this.validator.demandName"
				      />
			  </a-form-item>
			  <a-form-item label="需求描述">
				      <a-input type="textarea"
					 v-decorator="this.validator.demandDes"
				      />
			  </a-form-item>
			  <a-form-item label="需求截止日期">
				      <a-date-picker
              :disabled-date="disabledDate"
					 v-decorator="this.validator.getEndtimeFront"
				      />
			  </a-form-item>
			   <a-form-item label="需求分类">
				      <a-radio-group name="radioGroup"  v-decorator="this.validator.demandClassify">
					    <a-radio value="生产需求">
					      生产需求
					    </a-radio>
					    <a-radio value="评估需求">
					      评估需求
					    </a-radio>
					  </a-radio-group>
			  </a-form-item>
			  <a-form-item label="附件">
			      <a-upload
			        name="file"
              :headers="headers"
			        :action="fileAction"
			        @change="handleChange"
			        :multiple="true"
			        :data="uploadParam"
                :showUploadList="false"
                v-decorator="this.validator.upload"
			      >
			        <a-button> <a-icon type="upload" /> 选择方案文件 </a-button>
			      </a-upload>
			    </a-form-item>
        <a-form-item label="自定义范围">
          <a-input type="textarea" v-decorator="this.validator.area" />
        </a-form-item>
			    <a-form-item :wrapper-col="{ span: 12, offset: 6 }">
			      <a-button type="primary" html-type="submit">
			        确定
			      </a-button>
			    </a-form-item>

			  </a-form>
	</div>
</template>

<script>
  import {NEEDINSERT, UPLOADNEEDFILE} from '@/../static/js/apis.js'
  import {needForm} from "@/../static/js/formValidators.js"

  export default {
    inject: ['reload'],                                 //注入App里的reload方法
    data: () => ({
      formItemLayout: {
        labelCol: {span: 6},
        wrapperCol: {span: 10},
      },
      fileAction: UPLOADNEEDFILE.url,   //导入文件提交路径
      validator: needForm,
      userid: '',
      uploadParam: {}
    }),
    beforeCreate() {
      this.form = this.$form.createForm(this, {name: 'validate_other'});
    },
    methods: {
      handleChange(info) {
        if (info.file.status === 'done') {
          this.$message.success(`${info.file.name} 上传成功`);
        } else if (info.file.status === 'error') {
          this.$message.error(`${info.file.name} 上传失败`);
        }
      },
       disabledDate(startValue) {
        return startValue.valueOf() < (new Date().getTime()-24*60*60*1000);
    },
      handleSubmit(e) {
        let self = this;
        e.preventDefault();
        self.form.validateFields((err, values) => {
          if (!err) {
            values.getEndtimeFront = values.getEndtimeFront.format('YYYY-MM-DD')
            values.userid = self.userid
            console.log('Received values of form: ', values);
            NEEDINSERT(values, function (res) {
               self.$message.success(res.message);
               self.$router.push({path: '/needsManagement', query: {system: '业务管理'}})
               self.$store.commit('changeFirstNavSelected', '1')
            })
          }
        });
      },
    },
    computed: {
      headers () {
        return {
          "token" : localStorage.getItem("token")
        }
      }
    },
    created() {
      this.userid = parseInt(localStorage.getItem("userid"))
      this.uploadParam = {
        userid: this.userid
      }
    }
  };
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .formContent {
    padding-top: 30px
  }

  .searchCriteria {
    width: 90%;
  }

  .actionBtn button:not(:last-child),
  .ant-row button:not(:last-child) {
    margin-right: 20px;
  }
</style>
